<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>首页</title>
    <link rel="stylesheet" href="./css/index.css">
    <link rel="stylesheet" href="https://unpkg.com/swiper/swiper-bundle.css">  
    <script src="https://unpkg.com/swiper/swiper-bundle.js"> </script>  
    <script src="./js/axios.min.js"></script>
    <script src="./js/api.js"></script>
   
</head>
<body>
    <!-- header -->
    <div class="header-logowrap">
       <div class="header-logo">
           <a href="index.html" class="logo"></a>
           <div class="login">
                <a href="./html/login.html">注册</a>
                <span>|</span>
                <a href="./html/login.html">登录</a>
            </div>
           <div class="search">
               <input type="text" class="txt" placeholder="请输入您要搜索的商品或者店铺">
               <a class="btn-search"></a>
           </div>
          
       </div>
    </div>
    <div class="header-navwrap">
        <div class="header-nav">
            <div class="header-nav-list">
                <a href="/index.html" class="active">首页</a>
                <a href="./html/product.html" class="product">萌物库</a>
                <a href="/index.html" class="shop">品牌馆</a>
                <a href="./html/community.html" class="com">同袍社区</a>
            </div>
            <div class="skip">
                <a href="./html/cart.html" target="_blank" class="skip-cart">
                    <i><img src="./img/cart4.jpg" alt=""></i>
                    <span>购物车</span>
                </a>
                <a href="" class="join">
                    <li></li>
                    <span>店铺入驻</span>
                </a>
            </div>
           
        </div>
    </div>
    <div class="main">
        <!-- 轮播图 -->
        <div class="swiper-container">
            <div class="swiper-wrapper">
                <div class="swiper-slide"><img src="./img/banner-1.jpg" alt=""></div>
                <div class="swiper-slide"><img src="./img/banner-2.jpg" alt=""></div>
                <div class="swiper-slide"><img src="./img/banner-3.jpg" alt=""></div>
                <div class="swiper-slide"><img src="./img/banner-4.jpg" alt=""></div>
            </div>
            <!-- 如果需要分页器 -->
            <div class="swiper-pagination"></div>
            
            <!-- 如果需要导航按钮 -->
            <div class="swiper-button-prev"></div>
            <div class="swiper-button-next"></div>
            
            <!-- 如果需要滚动条 -->
            <!-- <div class="swiper-scrollbar"></div> -->
        </div>
        <!-- 商品列表 -->
        <div class="def-product">
            <p class="title">本周热卖</p>
            <div class="def-product-list">
                <ul class="acc">
                    <li>
                        <a href="./html/item.html"><img src="" alt=""></a>
                        <p class="price">span</p>
                        <p class="name"><a href=""></a></p>
                    </li>
                    <li>
                        <a href=""><img src="" alt=""></a>
                        <p class="price"></p>
                        <p class="name"><a href=""></a></p>
                    </li>
                    <li>
                        <a href=""><img src="" alt=""></a>
                        <p class="price"></p>
                        <p class="name"><a href=""></a></p>
                    </li>
                    <li>
                        <a href=""><img src="" alt=""></a>
                        <p class="price"></p>
                        <p class="name"><a href=""></a></p>
                    </li>
                    <li>
                        <a href=""><img src="" alt=""></a>
                        <p class="price"></p>
                        <p class="name"><a href=""></a></p>
                    </li>
                    <li>
                        <a href=""><img src="" alt=""></a>
                        <p class="price"></p>
                        <p class="name"><a href=""></a></p>
                    </li>
                    <li>
                        <a href=""><img src="" alt=""></a>
                        <p class="price"></p>
                        <p class="name"><a href=""></a></p>
                    </li>
                    <li>
                        <a href=""><img src="" alt=""></a>
                        <p class="price"></p>
                        <p class="name"><a href=""></a></p>
                    </li>
                </ul>
            </div>
        </div>
        <div class="def-product">
            <p class="title">汉服女装</p>
            <div class="def-product-list">
                <ul class="element">
                    <li>
                        <a href=""><img src="" alt=""></a>
                        <p class="price"></p>
                        <p class="name"><a href=""></a></p>
                    </li>
                    <li>
                        <a href=""><img src="" alt=""></a>
                        <p class="price"></p>
                        <p class="name"><a href=""></a></p>
                    </li>
                    <li>
                        <a href=""><img src="" alt=""></a>
                        <p class="price"></p>
                        <p class="name"><a href=""></a></p>
                    </li>
                    <li>
                        <a href=""><img src="" alt=""></a>
                        <p class="price"></p>
                        <p class="name"><a href=""></a></p>
                    </li>
                    <li>
                        <a href=""><img src="" alt=""></a>
                        <p class="price"></p>
                        <p class="name"><a href=""></a></p>
                    </li>
                    <li>
                        <a href=""><img src="" alt=""></a>
                        <p class="price"></p>
                        <p class="name"><a href=""></a></p>
                    </li>
                    <li>
                        <a href=""><img src="" alt=""></a>
                        <p class="price"></p>
                        <p class="name"><a href=""></a></p>
                    </li>
                    <li>
                        <a href=""><img src="" alt=""></a>
                        <p class="price"></p>
                        <p class="name"><a href=""></a></p>
                    </li>
                </ul>
            </div>
        </div>
        <div class="def-product">
            <p class="title">汉服男装</p>
            <div class="def-product-list">
                <ul class="boy">
                    <li>
                        <a href=""><img src="" alt=""></a>
                        <p class="price"></p>
                        <p class="name"><a href=""></a></p>
                    </li>
                    <li>
                        <a href=""><img src="" alt=""></a>
                        <p class="price"></p>
                        <p class="name"><a href=""></a></p>
                    </li>
                    <li>
                        <a href=""><img src="" alt=""></a>
                        <p class="price"></p>
                        <p class="name"><a href=""></a></p>
                    </li>
                    <li>
                        <a href=""><img src="" alt=""></a>
                        <p class="price"></p>
                        <p class="name"><a href=""></a></p>
                    </li>
                    <li>
                        <a href=""><img src="" alt=""></a>
                        <p class="price"></p>
                        <p class="name"><a href=""></a></p>
                    </li>
                    <li>
                        <a href=""><img src="" alt=""></a>
                        <p class="price"></p>
                        <p class="name"><a href=""></a></p>
                    </li>
                    <li>
                        <a href=""><img src="" alt=""></a>
                        <p class="price"></p>
                        <p class="name"><a href=""></a></p>
                    </li>
                    <li>
                        <a href=""><img src="" alt=""></a>
                        <p class="price"></p>
                        <p class="name"><a href=""></a></p>
                    </li>
                </ul>
            </div>
        </div>
        <div class="liner-banner">
            <a href=""><img src="/img/b609ad0e343e4112817b06a005490c25.png" alt=""></a>
        </div>
        <div class="def-product">
            <p class="title">汉元素</p>
            <div class="def-product-list">
                <ul class="girl">
                    <li>
                        <a href=""><img src="" alt=""></a>
                        <p class="price"></p>
                        <p class="name"><a href=""></a></p>
                    </li>
                    <li>
                        <a href=""><img src="" alt=""></a>
                        <p class="price"></p>
                        <p class="name"><a href=""></a></p>
                    </li>
                    <li>
                        <a href=""><img src="" alt=""></a>
                        <p class="price"></p>
                        <p class="name"><a href=""></a></p>
                    </li>
                    <li>
                        <a href=""><img src="" alt=""></a>
                        <p class="price"></p>
                        <p class="name"><a href=""></a></p>
                    </li>
                    <li>
                        <a href=""><img src="" alt=""></a>
                        <p class="price"></p>
                        <p class="name"><a href=""></a></p>
                    </li>
                    <li>
                        <a href=""><img src="" alt=""></a>
                        <p class="price"></p>
                        <p class="name"><a href=""></a></p>
                    </li>
                    <li>
                        <a href=""><img src="" alt=""></a>
                        <p class="price"></p>
                        <p class="name"><a href=""></a></p>
                    </li>
                    <li>
                        <a href=""><img src="" alt=""></a>
                        <p class="price"></p>
                        <p class="name"><a href=""></a></p>
                    </li>
                </ul>
            </div>
        </div>
        <div class="def-product">
            <p class="title">周边配饰</p>
            <div class="def-product-list">
                <ul class="hot">
                    <li>
                        <a href=""><img src="" alt=""></a>
                        <p class="price"></p>
                        <p class="name"><a href=""></a></p>
                    </li>
                    <li>
                        <a href=""><img src="" alt=""></a>
                        <p class="price"></p>
                        <p class="name"><a href=""></a></p>
                    </li>
                    <li>
                        <a href=""><img src="" alt=""></a>
                        <p class="price"></p>
                        <p class="name"><a href=""></a></p>
                    </li>
                    <li>
                        <a href=""><img src="" alt=""></a>
                        <p class="price"></p>
                        <p class="name"><a href=""></a></p>
                    </li>
                    <li>
                        <a href=""><img src="" alt=""></a>
                        <p class="price"></p>
                        <p class="name"><a href=""></a></p>
                    </li>
                    <li>
                        <a href=""><img src="" alt=""></a>
                        <p class="price"></p>
                        <p class="name"><a href=""></a></p>
                    </li>
                    <li>
                        <a href=""><img src="" alt=""></a>
                        <p class="price"></p>
                        <p class="name"><a href=""></a></p>
                    </li>
                    <li>
                        <a href=""><img src="" alt=""></a>
                        <p class="price"></p>
                        <p class="name"><a href=""></a></p>
                    </li>
                </ul>
            </div>
        </div>
        <div class="def-product brand">
            <p class="title">热门品牌</p>
            <div class="def-goodshop">
                <a href="https://www.hanfugou.com/shop/3196?from=default" target="_blank">
                    <img src="./img/shop1.jpeg_0.jpg" alt="">
                </a>
                <a href="https://www.hanfugou.com/shop/495?from=default" target="_blank">
                    <img src="./img/shop2.jpg_0.jpg" alt="">
                </a>
                <a href="https://www.hanfugou.com/shop/994?from=default" target="_blank">
                    <img src="./img/shop3.jpeg_0.jpg" alt="">
                </a>
                <a href="https://www.hanfugou.com/shop/3196?from=default" target="_blank">
                    <img src="./img/shop1.jpeg_0.jpg" alt="">
                </a>
                <a href="https://www.hanfugou.com/shop/495?from=default" target="_blank">
                    <img src="./img/shop2.jpg_0.jpg" alt="">
                </a>
                <a href="https://www.hanfugou.com/shop/994?from=default" target="_blank">
                    <img src="./img/shop3.jpeg_0.jpg" alt="">
                </a>
                <a href="https://www.hanfugou.com/shop/3196?from=default" target="_blank">
                    <img src="./img/shop1.jpeg_0.jpg" alt="">
                </a>
                <a href="https://www.hanfugou.com/shop/495?from=default" target="_blank">
                    <img src="./img/shop2.jpg_0.jpg" alt="">
                </a>
                <a href="https://www.hanfugou.com/shop/994?from=default" target="_blank">
                    <img src="./img/shop3.jpeg_0.jpg" alt="">
                </a>
                <a href="https://www.hanfugou.com/shop/3196?from=default" target="_blank">
                    <img src="./img/shop1.jpeg_0.jpg" alt="">
                </a>
                <a href="https://www.hanfugou.com/shop/495?from=default" target="_blank">
                    <img src="./img/shop2.jpg_0.jpg" alt="">
                </a>
                <a href="https://www.hanfugou.com/shop/994?from=default" target="_blank">
                    <img src="./img/shop3.jpeg_0.jpg" alt="">
                </a>
            </div>
        </div>
    </div>
    <div class="footerwrap">
        <div class="footer">
            <p>
                <a href="https://www.hanfuhui.com/copyright?key=aboutus" target="_blank">关于我们</a>
                <i>|</i>
                <a href="/join" target="_blank">商家入驻</a>
                <i>|</i>
                <a href="https://www.hanfuhui.com/copyright?key=shopjoin" target="_blank">入驻协议</a>
                <i>|</i>
                <a href="https://www.hanfuhui.com/copyright?key=helper" target="_blank">新手指南</a>
                <i>|</i>
                <a href="https://www.hanfuhui.com/copyright?key=cooperation" target="_blank">商务合作</a>
                <i>|</i>
                <a href="https://www.hanfuhui.com" target="_blank">汉服荟</a>
            </p>
            <p class="copyright">
                <a class="ebs" href="http://szcert.ebs.org.cn/5121967f-66cd-4d9c-acbc-9f8bb5024b4f" class="ebs" target="_blank"></a>
                CopyRight ©2018 深圳市汉服荟网络科技有限公司 版权所有
                <a href="http://beian.miit.gov.cn" target="_blank">粤ICP备14046913号-1</a> 
                电话：0755-21503399
            </p>
        </div>
    </div>
    <script src="./js/index.js"></script>
</body>
</html>